// >>>>> 产品管理目录子菜单页面样式 <<<<<

// >>>>> 属性管理页面 <<<<<
.view_attribute {
}

// 分类管理
.view_operation_category {
    .preview_image {
        @apply block h-full w-auto mx-auto;
    }

    .el-upload {
        @apply block;

        &-dragger {
            @apply w-auto h-48 p-3;

            .el-icon-upload {
                font-size: 4rem;
                @apply mt-6 mb-4 leading-none;
            }
        }
    }
}

// >>>>> 属性组管理页面 <<<<<
.view_attribute_group {
    // 关联属性对话框
    .linking_attribute_dialog {
        @apply max-w-3xl;

        .el-dialog__header {
            @apply pb-0;
        }
    }

    // 已关联属性组件
    .linked_attribute {
        .card {
            @apply p-0 border-0;
        }
    }

    // 未关联属性组件
    .unlinked_attribute {
        .card {
            @apply p-0 border-0;

            &-top {
                @apply pr-12;
            }
        }
    }
}

// >>>>> 基本属性管理页面 <<<<<
.view_attribute_basic {
    // 关联分类对话框

    // 对话框
    .el-dialog {
        // 关联对话框
        &.linking {
            @apply max-w-3xl;

            .el-dialog__header {
                @apply pb-0;
            }
        }

        // 编辑属性对话框
        &.editing {
        }
    }

    // 未关联属性
    .unlinked_attribute {
        .card {
            @apply p-0 border-0;

            &-top {
                @apply pr-12;
            }
        }

        .el-table {
            @apply h-80 overflow-auto;

            &__empty-text {
                line-height: 16rem;
            }
        }
    }
}

// >>>>> 销售属性管理页面 <<<<<
.view_attribute_sales {
    // 关联分类对话框
    .el-dialog {
        &.linking {
            @apply max-w-3xl;

            .el-dialog__header {
                @apply pb-0;
            }
        }
    }

    // 未关联属性
    .unlinked_attribute {
        .card {
            @apply p-0 border-0;

            &-top {
                @apply pr-12;
            }
        }
    }
}

// >>>>> 类别管理页面 <<<<<
.view_category {
    // grid-template-columns: 16rem auto;
    // @apply grid items-start gap-x-6;
    @apply flex items-start;

    .left {
        @apply w-64 flex-shrink-0;
    }

    .right {
        @apply ml-6 w-full;
    }

    .el-tree {
        @apply -mx-2 -mt-2;

        &-node {
            &.is-current > .el-tree-node__content {
                @apply bg-gray-100;
            }

            &__content {
                @apply h-8;
            }
        }
    }
}

// >>>>> 产品页面 <<<<<
.view_product {
    // 产品详情对话框
    .details_dialog {
        @apply max-w-5xl;

        .desc_list {
            @apply max-w-none;
        }
    }

    // 图片列表对话框
    .image_list_dialog {
        @apply max-w-3xl;
    }
}
